<template>
  <div>
    <van-popup
      v-model:show="props.show"
      position="bottom"
      closeable
      round
      close-icon="close"
      @click-overlay="zclosePopup"
      @click-close-icon="zclosePopup"
      :style="{ height: '42%' }"
    >
      <div class="title">工具箱</div>
      <div class="swit">
        <my-button
          v-for="(item, index) in tools"
          :key="index"
          :img="item.src"
          :title="item.title"
          @click="selTool(index)"
        ></my-button>
      </div>
    </van-popup>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { tools } from '../views/Home/map-data'
import { initMap } from '../map/map'
import MyButton from './MyButton.vue'
const props = defineProps({
  show: Boolean,
  basemap: Object,
})
const emit = defineEmits()
const zclosePopup = () => {
  emit('close')
}
const selTool = (e) => {
  // console.log(e)
  let param = e
  emit('addPnt', param)
  emit('meaD', param)
  emit('meaA', param)
  emit('clm', param)
  emit('cancel', param)
  emit('expor', param)
}
</script>

<style>
.title {
  height: 60px;
  font-size: 20px;
  font-weight: 100;
  line-height: 60px;
  padding-left: 10px;
}
.swit {
  display: flex;
  flex-wrap: wrap;
}
.layer {
  padding: 0 10px 10px 10px;
}
.layertitle {
  padding-left: 27px;
  font-weight: 310;
}
</style>
